{% extends "default.html" %}

{% block content %}
<div class="title">
	Historial de Pago - {{ request.client }}
</div>
<div class="content">
	<p>&nbsp;</p>
	<div class="font_title">La deuda actual, por las compras realizadas es de <span class="red_debtor">{{ request.partial_debt }} Bs</span>, sin embargo, por cuestion de 
	anteriores pagos, se lleva pagado <span class="red_debtor">{{ request.pay_done_before }} Bs</span>, por lo que la deuda real es de <span class="red_debtor">{{ request.total_debt }} Bs</span>.</div>
	<p>&nbsp;</p>
	<div class="font_title">Realizar pago</div>
	<form action="/staff/clients/{{ request.client.id }}/payment/pay/" method="post">
	<table class="data_table">
		<tr>
			<th>Fecha</th>
			<td>{% now "d \de F \de Y" %}</td>
		</tr>
		<tr>
			<th>Cantidad</th>
			<td>
				<input type="text" name="pay_quantity" id="pay_quantity">
				<select name="pay_quantity_currency" id="pay_quantity_currency" >
					{% for c in request.currencies %}
					<option value="{{ c.id }}">{{ c.symbol }}</option>
					{% endfor %}
				</select>
			</td>
		</tr>
		<tr>
			<td colspan="2"><div class="centered"><input type="submit" value="Realizar pago de la cantidad seleccionada"></div></td>
		</tr>
	</table>
	</form>
	<p>&nbsp;</p>

	<script language="javascript">
		document.totales = eval('{{ request.sales_total }}');		
		document.totales_index = eval('{{ request.sales_index }}');
		function carry_cost(id) {
			for (i=0; i < document.totales.length; i++) {
				if (document.totales_index[i]==id) {
					get('pay_quantity').value = document.totales[i];
					return;
				}
			}
		}
	</script>
	<div class="font_title">Ventas que dieron lugar a esta deuda</div>
	<table class="data_table">
		<tr>
			<th>Fecha</th>
			<th>Factura</th>
			<th>Cantidad</th>
			<th>Acciones</th>
		</tr>
		{% for s in request.sales %}
			<tr>
				<td>{{ s.made }}</td>
				<td>{{ s.bill_number }}</td>
				<td><span id="f{{ s.id }}"></span> Bs</td>
				<td>
					<a href="javascript:show_sale({{ s.id }})">Ver Reporte</a>
					<a href="javascript:carry_cost({{ s.id }})">Pagar</a>
				</td>
			</tr>
		{% endfor %}
	</table>
	<p>&nbsp;</p>
	<script language="javascript">
		for (i=0; i < document.totales_index.length; i++) {
			get('f'+document.totales_index[i]).innerHTML = document.totales[i];
		}
	</script>

	<div class="font_title">Pagos realizados</div>
	<table class="data_table">
		<tr>
			<th>Fecha</th>
			<th>Cantidad</th>
		</tr>
		{% for p in request.payments_done %}
		<tr>
			<td>{{ p.date }}</td>
			<td>{{ p.quantity }} {{ p.currency.symbol}}</td>
		</tr>
		{% endfor %}
	</table>

</div>
{% endblock %}